<template>
    <div class="View">
        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_1') }}
            </div>
            <el-input class="ipt" v-model="macStyle.macNumb"
                @input="macStyle.macNumb = $setMaxLength(macStyle.macNumb, 20)"></el-input>
        </div>
        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_2') }}
            </div>
            <el-input class="ipt" v-model="macStyle.lineNo"
                @input="macStyle.lineNo = $setMaxLength(macStyle.lineNo, 20)"></el-input>
        </div>
        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_3') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.ctgCode" placeholder=" "
                @change="$emit('getExtCodSourceComboxApi', false, 'tab1')">
                <el-option v-for="item in macStyleCom.ctgList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
        </div>
        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_4') }}
            </div>
            <el-input class="ipt" v-model="macStyle.from"
                @input="macStyle.from = $setMaxLength(macStyle.from, 20)"></el-input>
        </div>
        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_5') }}
            </div>
            <el-input class="ipt" v-model="macStyle.to"
                @input="macStyle.to = $setMaxLength(macStyle.to, 20)"></el-input>
        </div>
        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_6') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.lawCode" placeholder=" ">
                <el-option v-for="item in macStyleCom.lawList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
        </div>
        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_7') }}
            </div>
            <el-date-picker v-model="macStyle.makDate" type="month" :format="format" :value-format="format"
                placeholder=" " class="ipt picker">
            </el-date-picker>
        </div>
        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_8') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.mkrCode" placeholder=" ">
                <el-option v-for="item in macStyleCom.mkrList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
        </div>
        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_9') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.impCode" placeholder=" ">
                <el-option v-for="item in macStyleCom.impList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
        </div>

        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_10') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.stCode" placeholder=" ">
                <el-option v-for="item in macStyleCom.stList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
        </div>
        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_11') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.fncCode" placeholder=" ">
                <el-option v-for="item in macStyleCom.fncList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
        </div>
        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_12') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.outCode" placeholder=" ">
                <el-option v-for="item in macStyleCom.outList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
        </div>

        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_13') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.secCode" placeholder=" ">
                <el-option v-for="item in macStyleCom.secList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
        </div>
        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_14') }}
            </div>
            <el-input class="ipt" v-model="macStyle.note"
                @input="macStyle.note = $setMaxLength(macStyle.note, 20)"></el-input>
        </div>

        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_15') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.useCase" placeholder=" ">
                <el-option v-for="item in macStyleCom.useCaseList" :key="item.key" :label="item.label"
                    :value="item.key">
                </el-option>
            </el-select>
        </div>
        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_16') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.designPressLowerLimit" placeholder=" " style="width:130px;"
                @change="macStyle.designPressUpperLimit = macStyle.designPressLowerLimit">
                <el-option v-for="item in macStyleCom.designList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
            <el-input class="ipt right" style="width:230px;margin-left: 20px;"
                v-model="macStyle.designPressLowerLimitTex"
                @input="macStyle.designPressLowerLimitTex = $setMyNum(macStyle.designPressLowerLimitTex, '5 - 3')"></el-input>
        </div>

        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_17') }}

            </div>
            <el-select class="long-ipt" v-model="macStyle.designPressUpperLimit" placeholder=" " style="width:130px;"
                @change="macStyle.designPressLowerLimit = macStyle.designPressUpperLimit">
                <el-option v-for="item in macStyleCom.designList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
            <el-input class="ipt right" style="width:230px;margin-left: 20px;"
                v-model="macStyle.designPressUpperLimitTex"
                @input="macStyle.designPressUpperLimitTex = $setMyNum(macStyle.designPressUpperLimitTex, '5 - 3')"></el-input>
        </div>

        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_18') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.designTempLowerLimit" placeholder=" " style="width:130px;"
                @change="macStyle.designTempUpperLimit = macStyle.designTempLowerLimit">
                <el-option v-for="item in macStyleCom.designList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
            <el-input class="ipt right" style="width:230px;margin-left: 20px;"
                v-model="macStyle.designTempLowerLimitTex"
                @input="macStyle.designTempLowerLimitTex = $setMyNum(macStyle.designTempLowerLimitTex, '5 - 0')"></el-input>
        </div>

        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_19') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.designTempUpperLimit" placeholder=" " style="width:130px;"
                @change="macStyle.designTempLowerLimit = macStyle.designTempUpperLimit">
                <el-option v-for="item in macStyleCom.designList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
            <el-input class="ipt right" style="width:230px;margin-left: 20px;"
                v-model="macStyle.designTempUpperLimitTex"
                @input="macStyle.designTempUpperLimitTex = $setMyNum(macStyle.designTempUpperLimitTex, '5 - 0')"></el-input>
        </div>

        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_20') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.funPressLowerLimit" placeholder=" " style="width:130px;"
                @change="macStyle.funPressUpperLimit = macStyle.funPressLowerLimit">
                <el-option v-for="item in macStyleCom.designList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
            <el-input class="ipt right" style="width:230px;margin-left: 20px;" v-model="macStyle.funPressLowerLimitTex"
                @input="macStyle.funPressLowerLimitTex = $setMyNum(macStyle.funPressLowerLimitTex, '5 - 3')"></el-input>
        </div>

        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_21') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.funPressUpperLimit" placeholder=" " style="width:130px;"
                @change="macStyle.funPressLowerLimit = macStyle.funPressUpperLimit">
                <el-option v-for="item in macStyleCom.designList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
            <el-input class="ipt right" style="width:230px;margin-left: 20px;" v-model="macStyle.funPressUpperLimitTex"
                @input="macStyle.funPressUpperLimitTex = $setMyNum(macStyle.funPressUpperLimitTex, '5 - 3')"></el-input>
        </div>

        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_22') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.funTempLowerLimit" placeholder=" " style="width:130px;"
                @change="macStyle.funTempUpperLimit = macStyle.funTempLowerLimit">
                <el-option v-for="item in macStyleCom.designList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
            <el-input class="ipt right" style="width:230px;margin-left: 20px;" v-model="macStyle.funTempLowerLimitTex"
                @input="macStyle.funTempLowerLimitTex = $setMyNum(macStyle.funTempLowerLimitTex, '5 - 0')"></el-input>
        </div>

        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_23') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.funTempUpperLimit" placeholder=" " style="width:130px;"
                @change="macStyle.funTempLowerLimit = macStyle.funTempUpperLimit">
                <el-option v-for="item in macStyleCom.designList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
            <el-input class="ipt right" style="width:230px;margin-left: 20px;" v-model="macStyle.funTempUpperLimitTex"
                @input="macStyle.funTempUpperLimitTex = $setMyNum(macStyle.funTempUpperLimitTex, '5 - 0')"></el-input>
        </div>

        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_24') }}
            </div>
            <el-input class="ipt" v-model="macStyle.fluidName"
                @input="macStyle.fluidName = $setMaxLength(macStyle.fluidName, 20)"></el-input>
        </div>

        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_25') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.clsCode" placeholder=" ">
                <el-option v-for="item in macStyleCom.clsList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
        </div>
        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_26') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.chrCode" placeholder=" ">
                <el-option v-for="item in macStyleCom.chrList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
        </div>
        <div class="row">
            <div class="label">
                {{ $t('message.homeExt.tab1.label_27') }}
            </div>
            <el-select class="long-ipt" v-model="macStyle.kbnCode" placeholder=" ">
                <el-option v-for="item in macStyleCom.kbnList" :key="item.key" :label="item.label" :value="item.key">
                </el-option>
            </el-select>
        </div>

    </div>
</template>

<script>
import $ from "jquery";
import { getLocalStorage } from "@/utils/storage";
import { getExtCodSourceCombox, getExtCodSourceByUser, extCodSourceByUser } from "@/api/api";
import eventBus from "@/eventBus/bus";
export default {
    name: "RetrievalTab1",
    props: ['macStyle', 'macStyleCom'],
    data() {
        return {
            format: "yyyy-MM",
        };
    },
    components: {},
    watch: {},
    methods: {
        async save() {
            console.log(this.macStyle, '11111');
            console.log(this.macStyleCom, '11111');
        },

        async getOptionsList() {
            // let dataJson = {
            //     Account: getLocalStorage('userName'),//	是	string	登录账号
            //     PltCode: this.$store.state.pltCode,//	是	int	装置Code
            //     PrnCode: this.macStyle.ctgCode,//	是	int	カテゴリCode
            // }
            // let res = await getExtCodSourceCombox(dataJson);
            // this.macStyleCom = res.data.data.macStyle;
            this.$emit('getExtCodSourceComboxApi')
        },
    },
    created() { },
    mounted() {

    },
    beforeDestroy() {
        eventBus.$off("clearData_CH");
    },
    destroyed() { },
};
</script>
<style lang="scss" scoped>
.row {
    width: 100%;
    display: flex;
    // justify-content: start;
    padding: 7px 0;
    align-items: center;
    padding-left: 16px;

    .label {
        // width: 145px;
        min-width: 145px;
        height: 32px;
        display: flex;
        align-items: center;
    }

    .ipt {
        width: 380px;

        ::v-deep .el-input__inner {
            width: 100%;
            height: 32px;

        }
    }

    .right {

        ::v-deep .el-input__inner {
            text-align: right;

        }
    }

    .long-ipt {
        width: 380px;
        height: 32px;

        ::v-deep .el-input__inner {
            width: 100%;
            height: 32px;
        }

        ::v-deep .el-input__inner:focus {
            border: 1px solid #dcdfe6;
        }

        ::v-deep .el-input__icon {
            line-height: 32px;
            color: #909399;
        }

        ::v-deep .el-input__suffix {
            width: 32px;
            right: 0;
            background: #dee0e3;
        }
    }

    .picker {
        // width: 175px;
        height: 32px;
        // margin: 0px 10px;

        ::v-deep .el-input__inner {
            width: 100%;
            height: 32px;
        }

        ::v-deep .el-input__suffix {
            background: transparent;
        }

        ::v-deep .el-input__icon {
            line-height: 100%;
        }
    }

}
</style>